import React from 'react';
import {Form, Row, Col, Button, Dropdown, Menu, Icon, message ,Divider} from 'antd';
import Grid from '../../components/table/grid';
import SettleAccounts from './settleAccounts';
import {sessionManager} from '../../utils/sessionStorage';
import AuthButton from '../../components/auth/authButton'
import {withRouter} from 'react-router-dom';
import {injectIntl} from 'react-intl';
import StubPicker from '../../components/pickCity/StubPicker';
import BindVIN from './bindVIN';
import RemoveVIN from './removeVIN';
import _ from 'Lodash';
// import ModifyStub from './ModidyStub'

const FormItem = Form.Item;
const createForm = Form.create;

@withRouter
class powerStationManage extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            currentRowInfo: {},
            visible: false,
            visible4VIN: false,
            visible4removeVIN: false,
            visible4Modify: false,
            options: [],
            params: {},
            refresh: 0,
            accountIds: [],
            accountId: null
        };
        const common = this.props.intl.messages.common;
        this.columns = [{
            title: common.powerStationName,
            dataIndex: 'name',
            key: 'name',
        }, {
            title: common.DCEquipment,
            dataIndex: 'dcCnt',
            key: 'dcCnt',
        },
            {
                title: common.ACEquipment,
                dataIndex: 'acCnt',
                key: 'acCnt',
            },
            {
                title: common.MaxPower,
                dataIndex: 'kwLimit',
                key: 'kwLimit',
            }, {
                title: common.operation,
                key: 'operation',
                render: (text, record) => {
                    return (
                        <span>
                            <span data-auth="003001003">
                                <a onClick={() => this.showDiffMoudle(text, record, 'order')}>{common.chargeOrder}</a>
                                <Divider type="vertical"/>
                            </span>
                            <span>
                                <a onClick={() => this.showDiffMoudle(text, record, 'equipmentList')}>{common.equipmentList}</a>
                                <Divider type="vertical"/>
                            </span>
                            <span>
                                <a onClick={() => this.showDiffMoudle(text, record, 'baseInfo')}>{common.baseInfo}</a>
                                <Divider type="vertical"/>
                            </span>
                            <Dropdown overlay={(
                                <Menu>
                                    <Menu.Item>
                                        <a onClick={() => this.showDiffMoudle(text, record, 'priceInfo')}>{common.ElectricityPriceInformation}</a>
                                    </Menu.Item>
                                    <Menu.Item>
                                        <a onClick={() => this.showDiffMoudle(text, record, 'settleAccounts')}>{common.SettlementRules}</a>
                                    </Menu.Item>
                                    {/*<Menu.Item>*/}
                                    {/*<a onClick={() => this.showDiffMoudle(text, record, 'checkVIN')}>{common.checkVIN}</a>*/}
                                    {/*</Menu.Item>*/}
                                </Menu>
                            )}>
                            <a>
                                {common.more} <Icon type="down"/>
                            </a>
                        </Dropdown>
                </span>
                    )
                },
            }];
    }

    //清空
    handleReset = () => {
        this.props.form.resetFields();
    }
    //表单验证
    handleSubmit = (e) => {
        e.preventDefault();
        this.props.form.validateFieldsAndScroll((errors, values) => {
            if (!!errors) {
                console.log('Errors in form!!!');
                return;
            }
            console.log(values);
            values.name = values.name.currency;
            this.setState({
                visible: false,
                params: {...values},
                refresh: this.state.refresh + 1
            });
        });
    };

    freshGrid = () => {
        this.setState({
            refresh: this.state.refresh + 1
        });
    };

    openVINModal = () => {
        if (this.state.accountIds.length === 0) {
            message.warn('请选择电站');
            return
        }
        this.setState({
            visible4VIN: true,
        })
    };

    showDiffMoudle(text, record, moudle) {
        sessionManager.set('selectStuGroup', text);
        //清空对应类似页面得缓存
        sessionManager.set('equipIDNAMEinfo',{});
        switch (moudle) {
            case 'equipmentList':
                this.props.history.push({pathname: '/powerStation/equipmentList', state: {flag: true}});
                break;
            case 'baseInfo':
                this.props.history.push({pathname: '/powerStation/baseInfo'});
                break;
            case 'order':
                this.props.history.push({pathname: '/powerStation/chargeOrder'});
                break;
            case 'priceInfo':
                this.props.history.push('/powerStation/priceInfo');
                break;
            case 'settleAccounts':
                this.setState({
                    visible: true
                });
                break;
            case 'checkVIN':
                this.setState({
                    accountId: record.id,
                    visible4removeVIN: true,
                });
                break;
            default:
                this.props.history.push('/powerStation/equipmentList');
        }
    }

    handleCancel = () => {
        this.setState({
            visible: false,
            visible4VIN: false,
            visible4removeVIN: false,
            visible4Modify: false,
        });
    }

    render() {
        const {getFieldDecorator} = this.props.form;
        const common = this.props.intl.messages.common;
        const rowSelection = {
            onChange: (selectedRowKeys) => {
                this.setState({
                    accountIds: selectedRowKeys
                }, () => {
                    console.log(this.state)
                })
            },
        };
        return (
            <AuthButton>
                <div>
                    <form form={this.props.form} onSubmit={this.handleSubmit}>
                        <Row gutter={16}>
                            <Col xl={6} xxl={4}>
                                <FormItem
                                >
                                    {getFieldDecorator(`name`, {initialValue: {currency: undefined}})(
                                        <StubPicker url="/api/stubGroup/listForOption/qry"/>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={10}>
                                <FormItem>
                                    <Button className="ant-btn-84" onClick={this.handleReset}>{common.clear}</Button>
                                    <Button type="primary" className="ant-btn-84"
                                            htmlType="submit">{common.search}</Button>
                                    {/*<Button type="primary"  onClick={this.openVINModal}>{common.bindVIN}</Button>*/}
                                </FormItem>
                            </Col>
                        </Row>
                    </form>
                    <Grid rowSelection={rowSelection} refresh={this.state.refresh}
                          params={this.state.params}
                          columns={this.columns} url="/api/stubGroup/listForCorp/qry"/>
                    {/*<ModifyStub visible={this.state.visible4Modify} handleCancel={this.handleCancel}*/}
                                {/*freshGrid={this.freshGrid}/>*/}
                    <SettleAccounts visible={this.state.visible} handleCancel={this.handleCancel}/>
                    <BindVIN visible={this.state.visible4VIN} handleCancel={this.handleCancel}
                             accountIds={this.state.accountIds}/>
                    <RemoveVIN visible={this.state.visible4removeVIN} handleCancel={this.handleCancel}
                               accountId={this.state.accountId}/>
                </div>
            </AuthButton>
        )
    }
}

//ant 表格验证需要创建表格-createForm
powerStationManage = createForm()(powerStationManage);
export default injectIntl(powerStationManage)

